<template>
  <div class="child">
    <h3>子组件</h3>
    <h4>玩具：{{ toy }}</h4>
    <button @click="send">子传父</button>
  </div>
</template>

<script setup lang="ts" name="Child">
//在子组件中要声明传递参数给父组件的函数sendToFather
import { ref } from "vue";

let toy = ref("乐高");
//声明事件
const emit = defineEmits(["sendToFather"]);

function send() {
  emit("sendToFather", toy.value);
}
</script>

<style scoped>
.child {
  margin-top: 10px;
  background-color: rgb(76, 209, 76);
  padding: 10px;
  box-shadow: 0 0 10px black;
  border-radius: 10px;
}
</style>